<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>成功提交订单</title>
    <link rel="stylesheet" type="text/css" href="css/public.css">
    <link rel="stylesheet" type="text/css" href="css/swiper-4.3.3.min.css">
    <link rel="stylesheet" href="css/successfulSubmission.css">
</head>
<body>
<!-- 公共頂部 -->
<div id='pHead'>
    <div id='headerLine'>
        <div class="headerMid">

            <div class="headLeft">
                <div class='hlwelcome'><a href="#">您好，欢迎来来到本站！</a></div>
                <ul class="hlLogin">
                    <li><a href="#">登录</a></li>
                    <li><a href="#">注册</a></li>
                </ul>
            </div>

            <ul class="headRight">
                <li><a href="#">站内消息（<span>0</span>）</a></li>
                <li><a href="#">购物车（<span>0</span>）件</a></li>
                <li><a href="#">帮助中心</a></li>
            </ul>

        </div>
    </div>
    <!--logo图-->
    <div id="header">
        <div class="headerMid">
            <div class="headMain">
                <div id="logo">
                    <a href="#"><img src="images/public/logo.gif" height='76'/></a>
                </div>
                <!--数据-->
                <div class="flow-steps">
                    <ol class="cur1">
                        <li class="num1">
                            <span>我的购物车</span>
                            <em>1</em>
                        </li>
                        <li class="num2">
                            <span>核对订单信息</span>
                            <em>2</em>
                        </li>
                        <li class="num3">
                            <span>成功提交订单</span>
                            <em>3</em>
                        </li>
                        <li class="clear"></li>
                    </ol>
                </div>
            </div>
        </div>
    </div>
</div>

<!-- 主要内容写在这里 -->
<div style="clear: both; height: 1px;background-color: red;"></div>
<div style="background-color: #fff">
<div class="encircle">
    <img src="./img/jstj.jpg" alt="结算提交凭证正确对号图片">
    <div class="checkout_order_right">
        <h1>
            恭喜，订单提交成功，就差去付款了！<span>应付金额：<i>￥209.00</i></span>
        </h1>
        <div class="checkout_order_summary" style="position: relative;">
            <div class="summary_word" style="display:none">
            <!--<div class="summary_word" style="display:block;">-->
                <p>
                    订单号：<span>152972180925</span>收货信息：<i>123321</i><i>15555555555</i>
                </p>
            </div>
            <a href="javascript:void(0)" class="checkout_order_more"><em id="up1" name="0">收起</em><i class="order-succes-up"></i></a>
        </div>
        <div class="checkout_order_intro" id="up2">
            <div class="checkout_order_same">
                <p>订单信息：</p>
                <span>152972180925</span>
            </div>
            <div class="checkout_order_same">
                <p style="float:left;width:60px;">收货信息：</p>
                <p style="float:left;width:890px;margin:0 0 0 5px;height:auto;">
                    <i style="margin:0;">123321</i> <i>15555555555</i>
                    <i>北京-海淀区-三环以内-123</i>
                </p>
            </div>
            <div class="checkout_order_same">
                <p>商品信息：</p>
                <ul>
                    <li><a target="_blank" href="#"><i>【沃隆_每日坚果25g*30袋】精美礼盒原味混合干果综合坚果仁箱装</i></a></li>
                </ul>
            </div>
            <div class="checkout_order_same">
                <p>配送方式：</p>
                <i>圆通速递</i>
            </div>
            <div class="checkout_order_same">
                <p>配送时间：</p>
                <i>任意时间</i>
            </div>
            <div class="checkout_order_tools ">
                <a class="go_pay" href="#" target="_blank">去付款</a>
                <a href="#" class="go_continue">继续购物</a>
                <a href="#" class="go_state">我的订单&gt;&gt;</a>
            </div>
        </div>
    </div>
</div>
</div>
<!--结束-->


<!-- 公共底部 -->
<div id='pFoot'>
    <div class="bodyMids">
        <div class="pfBody">
            <div class="pfbTexts">

                <div class="pfbtLi">
                    <div class="pfbtPic pfbbac1"></div>
                    <ul class="pfbtLink">
                        <li>新手上路</li>
                        <li><a href="#">顾客必读</a></li>
                        <li><a href="#">会员等级折扣</a></li>
                        <li><a href="#">积分规则</a></li>
                        <li><a href="#">购物流程</a></li>
                        <li><a href="#">常见问题</a></li>
                    </ul>
                </div>

                <div class="pfbtLi">
                    <div class="pfbtPic pfbbac1"></div>
                    <ul class="pfbtLink">
                        <li>关于网站</li>
                        <li><a href="#">关于我们</a></li>
                        <li><a href="#">联系我们</a></li>
                        <li><a href="#">业务合作</a></li>
                    </ul>
                </div>

                <div class="pfbtLi">
                    <div class="pfbtPic pfbbac1"></div>
                    <ul class="pfbtLink">
                        <li>购物指南</li>
                        <li><a href="#">游客购物通道</a></li>
                        <li><a href="#">网站使用条款</a></li>
                        <li><a href="#">购物流程</a></li>
                    </ul>
                </div>

                <div class="pfbtLi">
                    <div class="pfbtPic pfbbac1"></div>
                    <ul class="pfbtLink">
                        <li>物流和配送</li>
                        <li><a href="#">配送范围</a></li>
                        <li><a href="#">配送方式</a></li>
                        <li><a href="#">关于收货和验货</a></li>
                    </ul>
                </div>

                <div class="pfbtLi">
                    <div class="pfbtPic pfbbac1"></div>
                    <ul class="pfbtLink">
                        <li>支付方式</li>
                        <li><a href="#">支付方式</a></li>
                        <li><a href="#">付款常见问题</a></li>
                        <li><a href="#">索取发票</a></li>
                    </ul>
                </div>

                <div class="pfbtLi">
                    <div class="pfbtPic pfbbac1"></div>
                    <ul class="pfbtLink">
                        <li>服务</li>
                        <li><a href="#">售后服务</a></li>
                        <li><a href="#">免责条款</a></li>
                        <li><a href="#">商品退换货保障</a></li>
                    </ul>
                </div>
            </div>
            <div class="pfbEWM">

            </div>
        </div>
    </div>
</div>


<script src="js/jquery-1.11.3.min.js"></script>
<script src="js/swiper-4.3.3.min.js"></script>
<script src="js/public.js"></script>
<script>
    var mySwiper = new Swiper('.swiper-container', {
        direction: 'horizontal',
        loop: true,
        autoplay: true,
        // 如果需要前进后退按钮
        navigation: {
            nextEl: '.swiper-button-next',
            prevEl: '.swiper-button-prev',
        }

    })
</script>
<script src="js/successfulSubmission.js"></script>
<script type="text/javascript"></script>
</body>
</html>
